import { Component } from "react";
// 推荐将BrowserRouter重命名为Router
// 1 导入Router`Route`Switch 组件
import { Router, Route, Switch } from "react-router-dom";

import Login from "./pages/Login";
import Layout from "./pages/Layout";
import AuthRoute from "./component/AuthRoute";
import history from "utils/history";
import Test from "pages/Tast";
export default class App extends Component {
  state = {};
  render() {
    return (
      // 2 实例化路由Router
      // 👍所有的代码，都要包在Router组件内

      // 3 组装BrowserRouter
      // 使用Router组件替代BrowserRouter 给它分配history属性
      <Router history={history}>
        {/* Switch负责匹配到第一个组建后，就不再向后匹配 */}
        {/* 3. 通过Switch和Route组件，设置匹配规则和挂载点 */}
        {/* 👍 Switch要包住所有的组件 */}
        <Switch>
          <Route path="/test" component={Test}></Route>
          {/* 💥React路由中，默认是不会匹配到第一个就停止匹配 */}
          {/* 重定向的/ 一般要和exact配合使用 */}
          <Route path="/login" component={Login}></Route>
          {/*  1. 删除一级路由中重定向和layout的路径，修改path为/,模糊匹配任意路径 */}

          {/* 鉴权路由组件 */}
          <AuthRoute path="/" component={Layout} aa="123"></AuthRoute>
        </Switch>
      </Router>
    );
  }
}
